.app-layout {
  @apply  h-screen;
  // @apply w-screen h-screen;
  .app-layout__header {
    @apply h-14;
    background: #0865cf;
  }
  .app-layout__sider {
    background: #000;
    .ant-layout-sider-children {
      @apply h-full flex flex-col;
      background-color: #2a2d35;
      .app-menu__wrapper {
        @apply flex-1;
        background-color: #2a2d35;

        .ant-menu-item {
          @apply h-14 p-2 m-0  !important;
          .ant-menu-title-content {
            @apply h-full rounded-md pl-6;
          }
          &.ant-menu-item-selected {
            background: transparent;
            .ant-menu-title-content {
              background-color: #202227;
            }
          }
        }
      }
      .side-trigger__wrapper {
        @apply p-6 text-white text-lg transition-all;
      }
    }
    &.ant-layout-sider-collapsed {
      .ant-menu-item {
        @apply h-14 p-2 m-0  !important;
        .ant-menu-title-content {
          @apply rounded-md p-0 block !important;
          width: 34px !important;
          height: 34px !important;
          overflow: hidden;
          & > .anticon {
            height: 34px;
            padding-left: 9px;
            padding-right: 9px;
          }
        }
        &.ant-menu-item-selected {
          background: red;
          .ant-menu-title-content {
            background-color: #202227;
          }
        }
      }
      .side-trigger__wrapper {
        @apply pl-4;
      }
    }
  }
}
